import styled from "styled-components"

const loading = styled.div`
  .loading {
    position: relative;
    width: 30px;
    height: 30px;
    border-style: solid;
    border-width: 2px;
    border-top-color: rgba(0, 0, 0, 0.2);
    border-left-color: #000;
    border-right-color: rgba(0, 0, 0, 0.2);
    border-bottom-color: rgba(0, 0, 0, 0.2);
    border-radius: 100%;

    animation: circle infinite 0.75s linear;
  }

  @keyframes circle {
    0% {
      transform: rotate(0);
    }
    100% {
      transform: rotate(360deg);
    }
  }
`
export default loading
